<template>
  <div class="main_box">
    <el-row class="header-row">
      <el-col>
        <div class="search_wrap">
          <el-form :inline="true" :model="filters" class="demo-form-inline" ref="searchForm">
            <el-form-item prop="serverCode">
              <el-input v-model="filters.serverCode" placeholder="货品编号" clearable></el-input>
            </el-form-item>
            <el-form-item prop="name">
              <el-input v-model="filters.name" placeholder="货品名称" clearable></el-input>
            </el-form-item>
            <el-form-item prop="classifyIds" v-if="userRole == 1">
              <el-cascader
                filterable
                clearable
                v-model="filters.classifyIds"
                :options="treeThreeServerList"
                :props="{
                  checkStrictly: true,
                  label: 'classifyName',
                  value: 'serverClassifyId',
                }"
                placeholder="货品分类"
              >
              </el-cascader>
            </el-form-item>
            <el-form-item prop="variantState">
              <el-select v-model="filters.variantState" clearable filterable placeholder="规格">
                <el-option v-for="item in variantStateList" :value="item.id" :key="item.id" :label="item.name"> </el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="businessId">
              <el-select
                v-model="filters.businessId"
                placeholder="商户"
                filterable
                clearable
                @change="
                  () => {
                    getBusinessClassifyList();
                    if (!filters.businessId) {
                      departList = [];
                    } else {
                      getDepartList(2);
                    }
                  }
                "
              >
                <el-option v-for="item in businessList" :key="item.id" :value="item.id" :label="item.name"> </el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="departIds">
              <el-cascader v-model="filters.departIds" :options="departList" clearable :props="{ value: 'departId', label: 'departName', checkStrictly: true }"> </el-cascader>
            </el-form-item>
            <el-form-item prop="businessClassifyId">
              <el-select style="width: 100%" v-model="filters.businessClassifyId" placeholder="商户分类" @change="filterClassifyId" ref="refSelect" clearable @clear="clearIcon">
                <el-option v-for="item in businessClassifyList" :value="item.id" :label="item.showName" :key="item.id">
                  <div class="business-classify_name" v-html="item.name"></div>
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="flag">
              <!-- <el-checkbox v-model="filters.visitFlag">上门</el-checkbox> -->
              <el-radio-group v-model="filters.flag">
                <el-radio :label="1"> 上门 </el-radio>
                <el-radio :label="2"> 到店 </el-radio>
                <el-radio :label="3"> 远程 </el-radio>
              </el-radio-group>
            </el-form-item>
            <!-- <el-form-item prop="shopFlag">
              <el-checkbox v-model="filters.shopFlag">到店</el-checkbox>
            </el-form-item>
            <el-form-item prop="remoteFlag">
              <el-checkbox v-model="filters.remoteFlag">远程</el-checkbox>
            </el-form-item> -->
            <el-form-item prop="fastFlag">
              <el-checkbox v-model="filters.fastFlag">紧急通知</el-checkbox>
            </el-form-item>
            <el-form-item>
              <el-button icon="el-icon-search" type="primary" @click="onSearch">查询</el-button>
              <el-button icon="el-icon-refresh-left" @click="resetForm">重置</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-col>
      <el-col>
        <div class="opration_wrap">
          <div>
            <el-tooltip content="刷新" placement="top">
              <el-button circle icon="el-icon-refresh-right" @click="reload" size="mini"></el-button>
            </el-tooltip>
          </div>

          <div class="opration-btn_wrap">
            <el-button type="primary" plain icon="fa fa-plus" v-has="permissionAdd" @click="handleClickAdd()" size="mini"> 新增 </el-button>
            <el-button type="primary" plain icon="fa fa-plus" v-has="permissionAdd" @click="handleClickBatchAdd()" size="mini"> 批量新增 </el-button>
            <el-button size="mini" icon="fa fa-plus" type="primary" v-has="permissionServerCombine" @click="handleAddServerCombine">新增套餐产品</el-button>
            <el-button type="primary" icon="fa fa-link" v-has="permissionBandAttr" @click="handleBatchBindAttr()" size="mini"> 批量绑定属性 </el-button>
            <!-- <el-button v-has="permissionBatchSetDepart" type="info" size="mini" icon="fa fa-link"
              @click="handleBatchBatchSetDepart()">
              批量设置部门
            </el-button>
            <el-button style="background-color: #406CC4;color:white" icon="fa fa-truck" v-has="permissionModifyStock"
              @click="handleClickModifyStock()" size="mini">
              批量修改库存
            </el-button>
            <el-button style="background-color: #2f497c;color:white" icon="el-icon-s-grid"  v-has="permissionBusinessClassify"
              @click="handleClickSetBClassify()" size="mini">
              批量关联商户分类
            </el-button> -->
            <el-button type="danger" plain icon="fa fa-copy" v-has="permissionAdd" @click="handleCommonServer" size="mini"> 复制公共货品 </el-button>
            <el-button type="success" icon="fa fa-copy" v-has="permissionAdd" @click="showCopyServer = true" size="mini"> 复制货品 </el-button>
            <el-button type="success" plain icon="el-icon-finished" v-has="permissionAdd" @click="showDistributionPopup()" size="mini"> 一键铺货 </el-button>
            <el-button type="warning" icon="el-icon-time" v-has="permissionTimeTemplate" @click="handleSetGoodsHours()" size="mini"> 批量设置时间模板 </el-button>
            <el-button type="warning" plain icon="fa fa-upload" v-has="permissionAdd" @click="handleRackCommonServer()" size="mini"> 上传公共货品库 </el-button>
            <el-button v-has="permissionBatchSet" style="background-color: #11d833; color: white" plain icon="el-icon-more" @click="handleBatchSet()" size="mini"> 批量设置 </el-button>
            <el-button type="danger" icon="el-icon-delete" v-has="permissionBatchDel" @click="handleClickBatchDel()" size="mini"> 批量删除 </el-button>
            <el-button type="warning" plain icon="el-icon-folder" v-has="permissionExportSet" @click="handleClickExportSet()" size="mini"> 导出货品设置 </el-button>
            <el-button icon="el-icon-plus" size="mini" plain type="success" v-has="permissionExportSet" @click="handleClickUpdateExportSet()">导入货品设置</el-button>
            <el-button icon="el-icon-plus" size="mini" plain type="warning" v-has="permissionBatchSetSpec" @click="handleBatchSetSpec">批量设置多规格</el-button>
            <el-button type="primary" plain icon="fa fa-plus" v-has="permissionBatchDelayNotice" @click="handleClickSetDelayNotice('', 2)" size="mini"> 批量设置延迟通知</el-button>
            <el-button type="primary" icon="fa fa-copy" size="mini" v-has="permissionCopyLessee" @click="copyLesseeChange">复制到租户</el-button>
            <el-button type="primary" icon="fa fa-copy" size="mini" v-has="permissionExportSet" @click="handleExportMainImage">批量导入货品主图</el-button>
          </div>
        </div>
      </el-col>
    </el-row>

    <el-row ref="tableRow">
      <!-- 列表 -->
      <el-table
        ref="tableList"
        :data="dataList"
        :fit="true"
        highlight-current-row
        v-loading="listLoading"
        @row-click="$refs.tableList.toggleRowSelection($event)"
        @selection-change="handleSelectionChange"
        element-loading-text="数据加载中，请稍后..."
        empty-text="对不起，没有找到相关数据！"
      >
        <el-table-column type="selection" width="50" align="center"></el-table-column>
        <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
        <el-table-column align="center" label="货品编号" prop="serverCode"> </el-table-column>
        <el-table-column align="center" label="货品图片" width="160">
          <template slot-scope="scope">
            <el-image title="点击可预览" :src="scope.row.mainImage" fit="cover" :preview-src-list="[scope.row.mainImage]" :z-index="scope.$index"> </el-image>
          </template>
        </el-table-column>
        <el-table-column align="center" label="货品名称" prop="name"> </el-table-column>
        <el-table-column align="center" label="货品分类">
          <template slot-scope="scope"> {{ scope.row.serverClassifyName }}-{{ scope.row.thirdClassifyName }} </template>
        </el-table-column>
        <el-table-column align="center" label="规格">
          <template slot-scope="scope">
            <el-tag type="danger" size="mini" effect="dark" v-if="scope.row.serverType == 2"> 套餐 </el-tag>
            <el-tag size="mini" type="danger" effect="dark" color="#F18311" v-else-if="scope.row.serverType == 3"> 计时 </el-tag>
            <el-tag size="mini" type="danger" effect="dark" color="#11F127" v-else-if="scope.row.serverType == 10"> 补贴 </el-tag>
            <el-tag size="mini" effect="dark" color="#3A7819" v-else-if="scope.row.serverType == 15"> 补差价 </el-tag>
            <el-tag effect="dark" type="warning" size="mini" v-else-if="scope.row.huskFlag == 1"> 空包产品 </el-tag>
            <el-tag effect="dark" size="mini" v-else-if="scope.row.variantState == 1"> 单品 </el-tag>
            <el-tag type="success" size="mini" effect="dark" v-else-if="scope.row.variantState == 2"> 多规格 </el-tag>
          </template>
        </el-table-column>
        <el-table-column align="center" label="上门/到店/远程/紧急通知" width="120">
          <template slot-scope="scope">
            <div>
              <el-tag size="mini" effect="dark" v-if="scope.row.visitFlag == 1"> 上门 </el-tag>
              <el-tag size="mini" effect="dark" v-if="scope.row.shopFlag == 1" type="success"> 到店 </el-tag>
              <div></div>
              <el-tag size="mini" effect="dark" v-if="scope.row.remoteFlag == 1" type="warning"> 远程 </el-tag>
              <el-tag size="mini" effect="dark" v-if="scope.row.fastFlag == 1" type="danger"> 急 </el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="是否需配送费" width="120">
          <template slot-scope="scope">
            <div>
              <el-tag size="mini" effect="dark" v-if="scope.row.deliveryFlag == 0" type="info"> 否 </el-tag>
              <el-tag size="mini" effect="dark" v-if="scope.row.deliveryFlag == 1"> 是 </el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="商户/部门" prop="businessName">
          <template slot-scope="scope">
            <div>{{ scope.row.businessName }}</div>
            <div>{{ scope.row.departName }}</div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="原价" prop="price"></el-table-column>
        <el-table-column align="center" label="售价" prop="salePrice"></el-table-column>
        <el-table-column align="center" label="包装费" prop="packageFee"></el-table-column>
        <el-table-column align="center" label="商户折扣比例" prop="discount"></el-table-column>
        <el-table-column align="center" width="90" label="创建时间" prop="createDate"></el-table-column>
        <el-table-column label="操作" width="150" fixed="right">
          <template slot-scope="scope">
            <el-button v-has="permissionCheck" @click.stop="handleClickDetail(scope.row)" size="mini">查看</el-button>
            <el-dropdown trigger="click" size="small">
              <el-button type="primary" @click.stop=""> <i class="fa fa-list-ul"></i>更多 </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item v-has="permissionEdit" @click.stop.native="handleClickEditor(scope.row)">编辑 </el-dropdown-item>
                <el-dropdown-item v-has="permissionModifyStock" @click.native="handleClickModifyStock(scope.row)"> 修改库存 </el-dropdown-item>
                <el-dropdown-item v-has="permissionBandAttr" @click.native="handleClickBandAttr(scope.row)">绑定属性 </el-dropdown-item>
                <el-dropdown-item v-if="scope.row.serverType == 1" v-has="permissionBandBusinessServer" @click.native="handleClickBandBS(scope.row)">绑定货品 </el-dropdown-item>
                <el-dropdown-item v-has="permissionCopy" @click.native="handleClickCopyBS(scope.row)">复制货品 </el-dropdown-item>
                <el-dropdown-item v-has="permissionBusinessClassify" @click.native="handleClickSetBClassify(scope.row)">关联商户分类 </el-dropdown-item>
                <el-dropdown-item v-has="permissionEditDelayNotice" @click.native="handleClickSetDelayNotice(scope.row, 1)">编辑延时通知</el-dropdown-item>
                <!-- <el-dropdown-item v-has="permissionUpStatus" @click.native="handleIsDisable(scope.row)">{{scope.row.state === 0 ? '启用' : '禁用'
                }}</el-dropdown-item> -->
                <el-dropdown-item v-has="permissionDelete" @click.native="handleClickDelete(scope.row)">删除 </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页工具条 -->
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page.pageNo"
        :page-sizes="[20, 100, 500]"
        :page-size="page.pageSize"
        layout="total, sizes, jumper, next, pager, prev"
        :total="page.pageTotal"
      ></el-pagination>
    </el-row>

    <!-- 批量绑定部门 -->
    <el-dialog class="custom-size__dialog" center :visible.sync="batchSetDepart.showBatchSetDepart" title="批量绑定部门">
      <el-cascader style="width: 100%" v-model="batchSetDepart.departIds" placeholder="请选择部门" :options="batchSetDepart.departList" :props="{ label: 'departName', value: 'departId', checkStrictly: true }">
      </el-cascader>
      <div slot="footer">
        <el-button type="primary" @click="confirmBatchSetDepart">确定</el-button>
        <el-button @click="batchSetDepart.showBatchSetDepart = false">取消</el-button>
      </div>
    </el-dialog>

    <!-- 绑定时间-->
    <el-dialog center :visible.sync="hoursModel.show" title="设置可售时间" width="fit-content">
      <el-select v-model="hoursModel.ghModelId" placeholder="请选择可售时间模板" @change="handleGhModelIdChange">
        <el-option v-for="item in hoursModel.relationsList" :label="item.modelName" :value="item.modelId" :key="item.modelId"> </el-option>
      </el-select>
      <el-table :data="hoursModel.relations" style="width: fit-content; margin-top: 10px">
        <el-table-column type="index" label="序号" align="center" width="100px"> </el-table-column>
        <el-table-column prop="beginHours" label="开始时间" align="center" width="200"> </el-table-column>
        <el-table-column prop="endHours" label="结束时间" align="center" width="200"> </el-table-column>
        <el-table-column prop="estimateTime" label="最快到达时间" align="center" width="200">
          <template slot-scope="scope"> {{ scope.row.estimateTime }}{{ formatTimeUnit(scope.row.timeUnit) }} </template>
        </el-table-column>
        <el-table-column prop="deliveryTime" label="可送时间段" align="center" width="200"> </el-table-column>
        <el-table-column prop="businessRemindTime" label="商户提醒时间(分)" align="center" width="140"> </el-table-column>
        <el-table-column prop="waiterRemindTime" label="服务员提醒时间(分)" align="center" width="140"> </el-table-column>
      </el-table>
      <div slot="footer">
        <el-button type="primary" @click="confirmSetGoodsHours">确定</el-button>
        <el-button @click="hoursModel.show = false">取消</el-button>
      </div>
    </el-dialog>
    <el-dialog width="30%" title="选择租户" :visible.sync="copyShow" @close="cancelCopyLessee">
      <div>
        <el-form>
          <el-form-item label="租户">
            <el-select v-model="lesseeInfo.lesseeId" clearable placeholder="请选择租户" @change="getBusinessList(2)">
              <el-option v-for="item in lesseeOptions" :key="item.value" :label="item.name" :value="item.value"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="商户" required>
            <el-select
              v-model="lesseeInfo.businessId"
              @change="
                () => {
                  if (lesseeInfo.businessId) {
                    getTreeThreeServerList_copy();
                    getDepartList(1);
                    getBusinessClassifyList_copy();
                  } else {
                    clearLesseeData();
                  }
                }
              "
              :disabled="lesseeInfo.lesseeId ? false : true"
              clearable
              placeholder="请选择商户"
            >
              <el-option v-for="item in businessOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="部门">
            <el-cascader
              placeholder="请选择部门"
              :disabled="lesseeInfo.lesseeId ? false : true"
              v-model="lesseeInfo.departId"
              :options="departOptions"
              clearable
              :props="{ value: 'departId', label: 'departName', checkStrictly: true }"
            >
            </el-cascader>
          </el-form-item>
          <el-form-item label="货品分类" required>
            <el-cascader
              placeholder="请选择货品分类"
              :disabled="lesseeInfo.lesseeId ? false : true"
              :key="cascaderKey"
              filterable
              clearable
              v-model="lesseeInfo.goodsTypeId"
              :options="goodsTypeOptions"
              :props="{ label: 'classifyName', value: 'serverClassifyId' }"
            >
            </el-cascader>
          </el-form-item>
          <el-form-item label="商户分类">
            <el-select
              :disabled="lesseeInfo.lesseeId ? false : true"
              class="business-classify_select"
              placeholder="请选择商户分类"
              v-selectrichtext="{ ids: lesseeInfo.businessTypeId, list: businessTypeOptions }"
              v-model="lesseeInfo.businessTypeId"
              clearable
              filterable
              multiple
            >
              <el-option v-for="item in businessTypeOptions" :value="item.id" :label="item.name" :key="item.id">
                <div class="business-classify_name" v-html="item.name"></div>
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer">
        <el-button type="primary" @click="copyLessee"> 提交 </el-button>
        <el-button @click="cancelCopyLessee"> 取消 </el-button>
      </div>
    </el-dialog>

    <batchDistribution :serverIds="selectedForm.ids" :businessId="selectedBusinessId" :show="showDistribution" @confirm="confirmDistribution" @cancel="showDistribution = false"></batchDistribution>

    <CommonServerSelect :businessId="filters.businessId" ref="commonServer" @getServerList="getServerList"> </CommonServerSelect>
    <CopyServer :show="showCopyServer" @cancel="showCopyServer = false" @confirm="confirmCopy"></CopyServer>
    <BindAttr ref="bindAttr" />
    <ModifyStock :title="modifyStock.title" v-model="modifyStock.show" :stock="modifyStock.stock" :list="modifyStock.list" @modifyStock="confirmStock"></ModifyStock>

    <SetBusinessClassify
      class="custom-size__dialog"
      :title="setBusinessClassify.title"
      v-model="setBusinessClassify.show"
      :classifyIds="setBusinessClassify.classifyIds"
      :list="setBusinessClassify.list"
      @confirm="confirmSetBClassify"
    >
    </SetBusinessClassify>

    <BindBusinessServer :show="bandBS.show" :id-type="2" :id="bandBS.id" @cancel="cancelBandBS" />
    <BatchSet v-model="batchSet.show" :list="selectedForm.list" @confirm="listData"></BatchSet>

    <uploadFile ref="uploadFile" @uploadFileList="uploadBusinessServerSetFile" :limit="1" accept="excel" folder="businessServer">
      <div slot="tip" style="margin-left: 150px">
        <a style="color: red" :href="serverSetModule">下载导入模板</a>
      </div>
    </uploadFile>
    <uploadFile ref="uploadMainImage" @uploadFileList="uploadBusinessServerMainImage" :limit="1" accept="excel" folder="businessServer">
      <div slot="tip" style="margin-left: 150px">
        <a style="color: red" :href="serverMainImageModule">下载导入模板</a>
      </div>
    </uploadFile>
    <BatchSetSpec :show.sync="batchSetSpec.show" @confirm="confirmBatchSetSpec"></BatchSetSpec>
    <delayNotice :delayType="2" :show="delayNoticeShow" :ids="selectedForm.ids" :operatorType="operatorType" @delayNoticeClose="delayNoticeClose" @delayNoticeConfirm="delayNoticeConfirm" />
  </div>
</template>
<script>
import delayNotice from '@/components/DelayNotice';
import BusinessServerApi from '@/api/goods/businessServer';
import BusinessApi from '@/api/business/business';
import CommonServerApi from '@/api/goods/commonServer';
import ServerClassifyApi from '@/api/server/serverClassify';
import BusinessDepartApi from '../../api/business/depart';
import batchDistribution from '@/components/batchDistribution';
import * as message from '@/constants/message';
import { getStorage } from '@/utils/auth';
import { extractTextAndImages } from '@/utils/index';
import { USER_INFO } from '@/constants/storeName';
import fileDownload from 'js-file-download';
import { BATCH_MODIFY_GOODS,BUSINESS_SERVER_MAIN_IMAGE_IMPORT } from '@/constants/constants';
import TimeTemplateApi from '@/api/goods/timeTemplate';
import uploadFile from '@/components/UploadFile';
import CommonServerSelect from '../../components/CommonServerSelect.vue';
import CopyServer from '../../components/CopyServer.vue';
import BindAttr from '../../components/BindAttr.vue';
import ModifyStock from './components/ModifyStock.vue';
import BindBusinessServer from './components/BindBusinessServer.vue';
import SetBusinessClassify from './components/SetBusinessClassify.vue';
import BatchSet from './components/BatchSet.vue';
import BatchSetSpec from './components/BatchSetSpec.vue';

export default {
  name: 'BusinessServerManagement',
  inject: ['reload'], //注入局部刷新
  data() {
    return {
      cascaderKey: 1,
      copyShow: false,
      lesseeOptions: [],
      businessOptions: [],
      departOptions: [],
      businessTypeOptions: [],
      goodsTypeOptions: [],
      lesseeInfo: {
        lesseeId: '',
        businessId: '',
        departId: [],
        goodsTypeId: [],
        businessTypeId: [],
      },
      userRole: '',
      dataList: [],
      businessClassifyList: [],
      departList: [],
      listLoading: true,
      imgList: [], //货品图片
      filters: {
        serverCode: '',
        name: '',
        businessId: '',
        departIds: '',
        classifyIds: [],
        variantState: '',
        // visitFlag: false,
        // shopFlag: false,
        // remoteFlag: false,
        flag: '',
        fastFlag: false,
        businessClassifyId: '',
      },
      selectedForm: {
        ids: [],
        state: '',
        businessIds: [],
        list: [],
      },
      variantStateList: [
        { id: 1, name: '单品' },
        { id: 2, name: '多规格' },
        { id: 3, name: '套餐' },
        { id: 4, name: '空包产品' },
        { id: 5, name: '计时' },
        { id: 6, name: '补贴' },
        { id: 7, name: '补差价' },
      ],
      selectedBusinessId: '', //选中的商户id
      businessList: [],
      treeThreeServerList: [],
      serverSetModule: BATCH_MODIFY_GOODS,
      serverMainImageModule: BUSINESS_SERVER_MAIN_IMAGE_IMPORT,
      page: {
        pageNo: 1,
        pageTotal: 0,
        pageSize: 20,
      },

      permissionAdd: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_ADD',
      permissionCheck: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_SEE',
      permissionEdit: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_EDIT',
      permissionBandAttr: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_BAND_ATTR',
      permissionDelete: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_DELETE',
      permissionBatchDel: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_BATCHDEL',
      permissionBatchSetDepart: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_BATCH_SET_DEPART',
      permissionModifyStock: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_MODIFY_STOCK',
      permissionTimeTemplate: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_TIME_TEMPLATE',
      permissionServerCombine: 'SYSTEM_MANAGER_GOODS_INFO_LIST_ADD_SERVER_COMBINE',
      permissionBusinessClassify: 'SYSTEM_MANAGER_GOODS_INFO_LIST_SET_CLASSIFY',
      permissionBandBusinessServer: 'SYSTEM_MANAGER_GOODS_INFO_LIST_BIND_BUSINESSSERVER',
      permissionBatchSet: 'SYSTEM_MANAGER_GOODS_INFO_LIST_BATCH_SET',
      permissionCopy: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_COPY',
      permissionExportSet: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_EXPORT_SET',
      permissionBatchSetSpec: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_BATCH_SET_SPEC',
      permissionBatchDelayNotice: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_BATCH_DELAY_NOTICE',
      permissionEditDelayNotice: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_EDIT_DELAY_NOTICE',
      permissionCopyLessee: 'SYSTEM_MANAGER_GOODS_BUSINESSSERVER_LIST_COPY_LESSEE',
      showDistribution: false,
      delayNoticeShow: false,
      operatorType: 1,
      showCopyServer: false,
      batchSetDepart: {
        showBatchSetDepart: false,
        departIds: [],
        departList: [],
      },
      modifyStock: {
        show: false,
        // serverIds:[],
        // serverId:"",
        stock: '',
        title: '',
        serverId: '',
        ids: [],
        list: [],
      },
      setBusinessClassify: {
        show: false,
        classifyIds: [],
        list: [],
      },
      hoursModel: {
        show: false,
        relations: [],
        ghModelId: '',
        relationsList: [],
      },
      bandBS: {
        show: false,
        id: '',
      },
      batchSet: {
        show: false,
      },
      serverId: '',
      batchSetSpec: {
        show: false,
        serverIds: [],
      },
    };
  },
  components: {
    batchDistribution,
    CommonServerSelect,
    CopyServer,
    BindAttr,
    ModifyStock,
    SetBusinessClassify,
    BindBusinessServer,
    BatchSet,
    uploadFile,
    BatchSetSpec,
    delayNotice,
  },
  mounted() {
    if (this.$route.query.businessId) {
      this.filters.businessId = Number(this.$route.query.businessId);
    }
    this.init();
    window.addEventListener('keydown', this.keyDown);
  },
  activated() {
    if (this.$route.query.businessId) {
      this.filters.businessId = Number(this.$route.query.businessId);
    }
    this.listData();
  },
  destroyed() {
    window.removeEventListener('keydown', this.keyDown, false);
  },
  watch: {
    goodsTypeOptions() {
      this.cascaderKey++;
    },
  },
  methods: {
    init() {
      // 获取用户的角色信息
      this.userRole = getStorage(USER_INFO).userRole;
      this.listLoading = true;
      this.getBusinessList(1);
      this.getTreeThreeServerList();
      this.listData();
      this.getTableHeight();
    },
    async getBusinessClassifyList() {
      this.filters.businessClassifyId = '';
      this.businessClassifyList = [];
      this.clearIcon();
      if (this.filters.businessId != '') {
        const res = await BusinessServerApi.classifyListIdName({
          businessId: this.filters.businessId,
        });
        this.businessClassifyList = res.data;
        this.businessClassifyList.forEach((item, index) => {
          item.showName = typeof extractTextAndImages(item.name) == 'string' ? item.name : extractTextAndImages(item.name).text;
        });
      }
    },
    getDepartList(i) {
      let params = {};
      if (i === 1) {
        params.businessId = this.lesseeInfo.businessId;
        params.tenantId = this.lesseeInfo.tenantId;
      } else {
        params.businessId = this.filters.businessId;
      }
      BusinessDepartApi.listMangerTree(params).then((res) => {
        if (i === 1) {
          this.departOptions = res.data;
        } else {
          this.departList = res.data;
        }
      });
    },
    copyLesseeChange() {
      if (this.selectedForm.ids.length == 0) {
        this.$message.error('请先选择货品');
        return false;
      }
      this.copyShow = true;
      this.getLesseeList();
    },
    getLesseeList() {
      BusinessApi.lesseeList({ filter: 1 }).then((res) => {
        if (res.status == 0) {
          this.lesseeOptions = res.data;
        }
      });
    },
    async getBusinessClassifyList_copy() {
      const res = await BusinessServerApi.classifyListIdName({ businessId: this.lesseeInfo.businessId, tenantId: this.lesseeInfo.lesseeId });
      this.businessTypeOptions = res.data;
    },
    setBusinessId() {
      this.filters.businessId = Number(this.$route.query.businessId);
    },
    keyDown(e) {
      //如果是回车则执行查询方法
      if (e.keyCode == 13) {
        this.onSearch();
      }
    },
    getTableHeight() {
      this.$nextTick(function () {
        this.maxHeight = window.innerHeight - this.$refs.tableRow.$el.offsetTop - 50;
        window.onresize = () => {
          this.maxHeight = window.innerHeight - this.$refs.tableRow.$el.offsetTop - 50;
        };
      });
    },
    handleSelectionChange(value) {
      this.selectedForm.ids = value.map((item) => item.serverId);
      this.selectedForm.businessIds = value.map((item) => item.businessId);
      this.selectedForm.list = value;
    },
    handleSizeChange(size) {
      let _this = this;
      _this.page.pageSize = size;
      _this.listData();
    },
    handleCurrentChange(val) {
      let _this = this;
      _this.page.pageNo = val;
      _this.listData();
    },
    handleClickAdd() {
      let _this = this;
      _this.$router.push('/goods/businessServerAdd');
    },
    handleClickBatchAdd() {
      this.$router.push('/goods/goodsBatchAdd');
    },

    handleClickExportSet() {
      if (this.filters.businessId == false) {
        this.$message.error('请先选择商户');
        return false;
      }
      const params = {
        businessIds: this.filters.businessId,
      };
      let loading = this.$loading({
        lock: true,
        text: '导出中',
        background: 'rgba(0, 0, 0, 0.7)',
      });
      BusinessServerApi.exportSetInfo(params)
        .then((res) => {
          fileDownload(res, '货品设置信息表格.xlsx');
        })
        .finally(() => {
          loading.close();
        });
    },
    handleClickUpdateExportSet() {
      let _this = this;
      _this.$refs.uploadFile.handleCreate();
    },
    uploadBusinessServerSetFile(val) {
      var _this = this;
      if (!val) {
        _this.$Utils.messageError('请选择excel上传');
        return;
      }
      BusinessServerApi.updateImportSetInfo({ file: val[0] }).then((res) => {
        this.$Utils.notifySuccess('导入设置成功');
      });
    },
    uploadBusinessServerMainImage(val){
      var _this = this;
      if (!val) {
        _this.$Utils.messageError('请选择excel上传');
        return;
      }
      BusinessServerApi.importMainImage({ file: val[0] }).then((res) => {
        this.$Utils.notifySuccess('导入设置成功');
      });
    },
    handleBatchBindAttr() {
      const { businessIds, ids } = this.selectedForm;
      if (ids == 0) {
        this.$message.error('请至少选择一项');
        return;
      }
      if (Array.from(new Set(businessIds)).length > 1) {
        return this.$message.error('请选择相同商户');
      }

      this.$refs.bindAttr.handleCreate({
        type: 3,
        ids,
        businessId: businessIds[0],
      });
    },
    handleBatchBatchSetDepart() {
      const { ids, businessIds } = this.selectedForm;
      if (ids == 0) {
        this.$message.error('请至少选择一项');
        return;
      }

      if (Array.from(new Set(businessIds)).length > 1) {
        this.$message.error('只能选择相同的商户');
        return;
      }

      BusinessDepartApi.listMangerTree({ businessId: businessIds[0] }).then((res) => {
        this.setDisabled(res.data);
        this.batchSetDepart.departList = res.data;
        this.batchSetDepart.departIds = [];
        this.batchSetDepart.showBatchSetDepart = true;
      });
    },
    setDisabled(list) {
      list.forEach((item) => {
        if (!item.power) {
          item.disabled = true;
        }
        if (item.children) {
          this.setDisabled(item.children);
        }
      });
    },
    confirmBatchSetDepart() {
      const departIds = this.batchSetDepart.departIds;
      const { ids, businessIds } = this.selectedForm;
      const params = {
        ids,
        departId: departIds[0] || '',
        firstDepartId: departIds[1] || '',
        secondDepartId: departIds[2] || '',
        thirdDepartId: departIds[3] || '',
        businessId: businessIds[0],
      };
      this.$confirm('确认批量设置部门吗？', '提示', {}).then(() => {
        BusinessServerApi.batchSetDepart(params).then(() => {
          this.batchSetDepart.showBatchSetDepart = false;
          this.$Utils.notifySuccess('批量设置成功');
          this.listData();
        });
      });
    },

    filterClassifyId() {
      let classifyItem = this.businessClassifyList.filter((item) => this.filters.businessClassifyId == item.id);
      if (extractTextAndImages(classifyItem[0].name) != 'string') {
        var result = extractTextAndImages(classifyItem[0].name);
        this.$refs['refSelect'].$el.children[0].children[0].setAttribute(
          'style',
          typeof result != 'string' && result.images[0]
            ? `
				background: url(${result.images[0]}) no-repeat;
				background-position: 10px center;
				background-size: 20px 20px;
				text-indent: 20px;
				`
            : ``,
        );
      }
    },
    clearIcon() {
      this.$refs['refSelect'].$el.children[0].children[0].setAttribute('style', ``);
    },
    handleSetGoodsHours() {
      const { hoursModel, selectedForm } = this;
      if (!selectedForm.ids.length) {
        this.$message.error('至少选择一项');
        return;
      }
      const businessIds = Array.from(new Set(selectedForm.businessIds));
      if (businessIds.length > 1) {
        this.$message.error('只能是相同商户');
        return;
      }

      TimeTemplateApi.listIdName({ businessId: businessIds[0] }).then((res) => {
        hoursModel.relationsList = res.data;
      });
      hoursModel.ghModelId = '';
      hoursModel.relations = [];
      hoursModel.show = true;
    },
    formatTimeUnit(cell) {
      if (cell == 1) {
        return '分钟';
      } else if (cell == 2) {
        return '时';
      } else {
        return '';
      }
    },
    handleGhModelIdChange() {
      const { ghModelId, relationsList } = this.hoursModel;
      if (!ghModelId) {
        this.hoursModel.relations = [];
        return;
      } else {
        const val = relationsList.find((item) => item.modelId == ghModelId);
        if (val) {
          this.hoursModel.relations = val.relations;
        }
      }
    },
    confirmSetGoodsHours() {
      const { selectedForm, hoursModel } = this;
      if (!hoursModel.ghModelId) {
        this.$message.error('请选择可售时间模板');
        return;
      }

      this.$confirm('确定设置可售时间吗？', '提示', {}).then(() => {
        const params = {
          serverIds: selectedForm.ids,
          ghModelId: hoursModel.ghModelId,
        };
        TimeTemplateApi.batchSetModel(params).then(() => {
          this.listData();
          this.$Utils.notifySuccess('设置成功');
          hoursModel.show = false;
        });
      });
    },
    handleClickBatchDel() {
      if (this.selectedForm.ids == 0) {
        this.$message.error('请至少选择一项');
        return;
      }
      this.$confirm('确认批量删除这些货品吗？', '提示', {}).then(() => {
        let params = {
          ids: this.selectedForm.ids,
          state: -1,
        };
        BusinessServerApi.batchDelete(params).then((res) => {
          this.listData();
          this.$Utils.notifySuccess('删除成功!');
        });
      });
    },
    handleClickEditor(row) {
      this.$router.push({
        path: row.serverType == 2 ? '/goods/bussSerComboEdit' : '/goods/businessServerEdit',
        query: { id: row.serverId },
      });
    },
    handleClickBandAttr(row) {
      this.$refs.bindAttr.handleCreate({
        type: 3,
        id: row.serverId,
        businessId: row.businessId,
      });
    },

    handleClickModifyStock(row) {
      const { modifyStock, selectedForm } = this;
      Object.assign(this.modifyStock, this.$options.data().modifyStock);
      if (row) {
        const { stock, variantState, serverId } = row;
        modifyStock.title = '修改库存';
        modifyStock.show = true;
        modifyStock.serverId = serverId;
        if (variantState == 2) {
          BusinessServerApi.listVariantInfo({ serverId }).then((res) => {
            modifyStock.list = res.data;
          });
        } else {
          modifyStock.stock = stock;
        }
      } else {
        const { list } = selectedForm;
        // 批量修改库存
        if (!list.length) {
          this.$message.error('请至少选择一项数据');
          return;
        }
        const list2 = list.filter((item) => item.variantState == 1);
        if (list.length != list2.length) {
          this.$message.error('只能选择单品的产品');
          return;
        }
        modifyStock.ids = list2.map((item) => item.serverId);
        modifyStock.show = true;
        modifyStock.title = '批量修改库存';
      }
    },
    confirmStock(val) {
      const { stock, list } = val;
      const { serverId } = this.modifyStock;
      const { modifyStock, listData } = this;
      if (!modifyStock.list.length) {
        // 批量修改或者单品修改
        const params = {
          state: stock,
          ids: modifyStock.ids.length > 0 ? modifyStock.ids : [serverId],
        };
        BusinessServerApi.setStock(params).then(() => {
          listData();
          this.$Utils.notifySuccess('修改成功');
          this.modifyStock.show = false;
        });
      } else {
        // 多规格修改
        const params = {
          businessServerVariants: list.map((item) => ({
            bsVariantId: item.bsVariantId,
            stock: item.stock,
          })),
          serverId,
        };
        BusinessServerApi.setMoreVariantStock(params).then((res) => {
          listData();
          this.$Utils.notifySuccess('修改成功');
          this.modifyStock.show = false;
        });
      }
    },
    handleClickSetBClassify(row) {
      const { setBusinessClassify } = this;
      let businessId = '';
      if (!row) {
        const { businessIds } = this.selectedForm;
        // 批量设置
        if (!businessIds.length) {
          this.$message.error('至少选择一项数据');
          return;
        }
        if (Array.from(new Set(businessIds)).length > 1) {
          this.$message.error('只能是相同的商户');
          return;
        }
        businessId = businessIds[0];
        setBusinessClassify.title = '批量关联商户分类';
      } else if (row) {
        this.serverId = row.serverId;
        businessId = row.businessId;
        setBusinessClassify.title = '关联商户分类';
        // 单个设置
      }

      const params = {
        businessId,
        serverId: row ? -Number(row.serverId) : '',
      };

      BusinessServerApi.classifyListIdName(params).then((res) => {
        const list = res.data || [];
        setBusinessClassify.list = list;
        setBusinessClassify.classifyIds = list.filter((item) => item.state).map((item) => item.id);
        setBusinessClassify.show = true;
      });
    },
    confirmSetBClassify(val) {
      const { title } = this.setBusinessClassify;
      if (title == '批量关联商户分类') {
        const { ids } = this.selectedForm;
        const params = {
          serverIds: ids,
          classifyIds: val,
        };
        BusinessServerApi.batchSetRelation(params).then(() => {
          this.$Utils.notifySuccess('批量设置成功');
        });
      } else {
        const params = {
          id: this.serverId,
          ids: val,
        };
        BusinessServerApi.setRelation(params).then(() => {
          this.$Utils.notifySuccess('设置成功');
        });
      }
    },
    handleAddServerCombine() {
      const { businessId } = this.filters;
      if (!this.filters.businessId) {
        this.$message.error('请选择商户');
        return;
      }
      this.$router.push({
        name: '新增货品套餐组合',
        params: {
          businessId,
        },
      });
    },
    // handleClickDetail(row) {
    //   let _this = this
    //   _this.$router.push({
    //     path: '/goods/businessServerDetail',
    //     query: { id: row.serverId }
    //   })
    // },
    handleClickDetail(row) {
      this.$router.push({
        path: row.serverType == 2 ? '/goods/bussSerComboDetail' : '/goods/businessServerDetail',
        query: { id: row.serverId },
      });
    },
    handleIsDisable(row) {
      let _this = this;
      let currentState = row.state === 0 ? 1 : 0;
      this.$confirm(currentState ? '是否启用？' : '是否禁用', message.TITLE_PROMPT, {}).then(() => {
        BusinessServerApi.deletebusinessServer({
          id: row.serverId,
          state: currentState,
        }).then((res) => {
          this.$Utils.notifySuccess();
          _this.listData();
        });
      });
    },
    handleClickDelete(val) {
      let _this = this;
      _this.$confirm(message.MSG_CONFIRM_DELETE, message.TITLE_PROMPT, {}).then(() => {
        BusinessServerApi.deleteBusinessServer({
          id: val.serverId,
          state: -1,
        }).then((res) => {
          this.$Utils.notifySuccess();
          _this.listData();
        });
      });
    },
    resetForm() {
      this.$refs.searchForm.resetFields();
      this.filters.businessId = '';
      this.businessClassifyList = [];
      this.clearIcon();
      this.onSearch();
    },
    onSearch() {
      this.listLoading = true;
      this.page.pageNo = 1;
      this.listData();
    },
    // 一键铺货
    showDistributionPopup() {
      if (this.selectedForm.ids.length <= 0) {
        this.$message({
          type: 'error',
          message: '请至少选择一项',
        });
        return;
      }

      let arr = Array.from(new Set(this.selectedForm.businessIds));
      if (arr.length > 1) {
        this.$message({
          type: 'error',
          message: '必须选择相同商户',
        });
        return;
      }
      this.selectedBusinessId = this.selectedForm.businessIds[0];
      this.showDistribution = true;
    },
    handleRackCommonServer() {
      if (this.selectedForm.ids.length == 0) {
        this.$message.warning('请至少选择一项');
        return;
      }
      this.$confirm('确认上传公共货品库吗？', '提示', {}).then((res) => {
        CommonServerApi.uploadServer({ ids: this.selectedForm.ids }).then((res) => {
          this.$Utils.notifySuccess();
          this.listData();
        });
      });
    },
    handleBatchSet() {
      const { batchSet, selectedForm } = this;
      if (!selectedForm.ids.length) {
        this.$message.error('请至少选择一项数据');
        return;
      }
      batchSet.show = true;
    },
    confirmBatchSet() {
      // this.$Utils.notifySuccess("设置成功！")
    },
    confirmDistribution() {
      this.showDistribution = false;
      this.$Utils.notifySuccess();
      this.listData();
    },
    confirmCopy() {
      this.showCopyServer = false;
      this.$Utils.notifySuccess();
      this.listData();
    },
    handleClickBandBS(row) {
      this.bandBS.id = row.serverId;
      this.bandBS.show = true;
    },
    cancelBandBS() {
      this.bandBS.show = false;
    },
    handleClickCopyBS(row) {
      // if(!this.filters.businessId){
      //   this.$message.error("请选择商户")
      //   return
      // }
      this.$confirm('确定复制该货品', '提示', {}).then(() => {
        const params = {
          id: row.serverId,
          state: 1,
        };
        BusinessServerApi.businessServerCopy(params).then(() => {
          this.$Utils.notifySuccess('复制成功');
          this.listData();
        });
      });
    },
    // 获取商户列表
    getBusinessList(i) {
      if (i === 1) {
        BusinessApi.listIdNameVo().then((res) => {
          this.businessList = res.data;
        });
      } else {
        if (this.lesseeInfo.lesseeId) {
          let params = {
            tenantId: this.lesseeInfo.lesseeId,
          };
          BusinessApi.listIdNameVo(params).then((res) => {
            this.businessOptions = res.data;
            this.departOptions = [];
            this.businessTypeOptions = [];
            this.goodsTypeOptions = [];
            this.lesseeInfo.businessId = '';
            this.lesseeInfo.departId = [];
            this.lesseeInfo.goodsTypeId = [];
            this.lesseeInfo.businessTypeId = [];
          });
        } else {
          this.businessOptions = [];
        }
      }
    },
    // 获取二三级服务列表
    getTreeThreeServerList() {
      ServerClassifyApi.listServerClassify({ level: 2 }).then((res) => {
        this.treeThreeServerList = res.data;
      });
    },
    // 获取二三级服务列表
    getTreeThreeServerList_copy() {
      let params = {
        level: 2,
        businessId: this.lesseeInfo.businessId,
        tenantId: this.lesseeInfo.lesseeId,
      };
      ServerClassifyApi.listServerClassify(params).then((res) => {
        this.goodsTypeOptions = res.data;
      });
    },
    // 通过商户列id获取商户名称
    getBusinessName(id) {
      let value = this.businessList.find((item) => item.id == id);
      if (value) {
        return value.name;
      }
    },
    handleCommonServer() {
      if (!this.filters.businessId) {
        this.$message.error('请选择商户');
        return;
      }
      this.$refs.commonServer.handleCreate();
    },
    getServerList(val) {
      console.log(val);
      let params = {
        commonServerIds: val.list.map((item) => item.commonServerId),
        businessId: this.filters.businessId,
        departId: val.departId,
        firstDepartId: val.firstDepartId,
        secondDepartId: val.secondDepartId,
        thirdDepartId: val.thirdDepartId,
      };
      BusinessServerApi.batchCopyToBS(params).then((res) => {
        this.$Utils.notifySuccess();
        this.listData();
      });
    },
    handleBatchSetSpec() {
      const {
        selectedForm: { list, ids },
        batchSetSpec,
      } = this;
      if (!ids.length) return this.$message.error('请至少选择一项数据');
      if (list.some((item) => item.variantState !== 1)) return this.$message.error('只能设置单品的');
      batchSetSpec.ids = ids;
      batchSetSpec.show = true;
    },
    async confirmBatchSetSpec({ specValList, specName, specUnit, specDesc }) {
      await this.$confirm('确定提交吗？', '提示');
      const params = {
        serverIds: this.batchSetSpec.ids,
        specValList,
        specName,
        specUnit,
        specDesc,
      };
      await BusinessServerApi.batchSetMultiVariant(params);
      this.batchSetSpec.show = false;
      this.listData();
      this.$message.success('设置成功！');
    },
    listData() {
      // 获取列表数据
      let _this = this;
      let cond = {
        pageNo: _this.page.pageNo,
        pageSize: _this.page.pageSize,
      };
      cond.serverCode = _this.filters.serverCode;
      cond.name = _this.filters.name;
      cond.businessId = _this.filters.businessId;
      cond.businessClassifyId = _this.filters.businessClassifyId;
      // cond.classifyId = _this.filters.classifyId
      cond.serverClassifyId = _this.filters.classifyIds[0] ? _this.filters.classifyIds[0] : '';
      cond.thirdClassifyId = _this.filters.classifyIds[1] ? _this.filters.classifyIds[1] : '';
      // cond.visitFlag = _this.filters.visitFlag ? 1 : ''
      // cond.shopFlag = _this.filters.shopFlag ? 1 : ''
      // cond.remoteFlag = _this.filters.remoteFlag ? 1 : ''
      cond.fastFlag = _this.filters.fastFlag ? 1 : '';

      if (_this.filters.flag === 1) cond.visitFlag = 1;
      if (_this.filters.flag === 2) cond.shopFlag = 1;
      if (_this.filters.flag === 3) cond.remoteFlag = 1;
      if (_this.filters.variantState === 3) {
        cond.serverType = 2;
      } else if (this.filters.variantState === 4) {
        cond.huskFlag = 1;
      } else if (this.filters.variantState === 5) {
        cond.serverType = 3;
      } else if (this.filters.variantState === 6) {
        cond.serverType = 10;
      } else if (this.filters.variantState === 7) {
        cond.serverType = 15;
      } else {
        cond.variantState = _this.filters.variantState;
      }
      cond.departId = this.filters.departIds[0] || '';
      cond.firstDepartId = this.filters.departIds[1] || '';
      cond.secondDepartId = this.filters.departIds[2] || '';
      cond.thirdDepartId = this.filters.departIds[3] || '';
      BusinessServerApi.listBusinessServer(cond)
        .then((res) => {
          _this.dataList = res.data.list;
          _this.page.pageTotal = res.data.total;
          _this.imgList = res.data.list.map((item) => item.mainImage);
          _this.$refs.tableList.bodyWrapper.scrollTop = 0;
          _this.listLoading = false;
          setTimeout(() => {
            _this.$refs.tableList.doLayout();
          });
        })
        .catch((err) => {
          _this.listLoading = false;
        });
    },
    handleClickSetDelayNotice(item, s) {
      //s 1等于编辑 2等于批量设置
      this.operatorType = s;
      if (item.serverId) {
        for (let i in this.dataList) {
          this.$refs.tableList.toggleRowSelection(this.dataList[i], false);
        }
        this.selectedForm.ids = [item.serverId];
        this.$refs.tableList.toggleRowSelection(item, true);
      }
      if (this.selectedForm.ids.length == 0) {
        this.$message.error('至少选择一项分类');
        return false;
      }
      this.delayNoticeShow = true;
    },
    handleExportMainImage(){
      this.$refs.uploadMainImage.handleCreate();
    },
    delayNoticeClose() {
      this.delayNoticeShow = false;
    },
    delayNoticeConfirm() {
      this.delayNoticeShow = false;
      this.listData();
    },
    copyLessee() {
      if (!this.lesseeInfo.businessId) {
        this.$message.error('请选择商户');
        return false;
      }
      if (this.lesseeInfo.goodsTypeId.length == 0) {
        this.$message.error('请选择货品分类');
        return false;
      }
      let params = {
        targetBusinessId: this.lesseeInfo.businessId,
        serverIds: this.selectedForm.ids,
        departId: this.lesseeInfo.departId[0] || '',
        firstDepartId: this.lesseeInfo.departId[1] || '',
        secondDepartId: this.lesseeInfo.departId[2] || '',
        thirdDepartId: this.lesseeInfo.departId[3] || '',
        serverClassifyId: this.lesseeInfo.goodsTypeId[0],
        thirdClassifyId: this.lesseeInfo.goodsTypeId[1],
        businessClassifyIds: this.lesseeInfo.businessTypeId,
        tenantId: this.lesseeInfo.lesseeId,
      };

      this.$confirm('确认复制选中产品吗？', '提示', {}).then(() => {
        BusinessServerApi.copyServer(params)
          .then((res) => {
            this.$Utils.notifySuccess('复制成功');
            this.cancelCopyLessee();
          })
          .finally(() => {});
      });
    },
    clearLesseeData() {
      this.departOptions = [];
      this.businessTypeOptions = [];
      this.goodsTypeOptions = [];
      this.lesseeInfo.businessId = '';
      this.lesseeInfo.departId = [];
      this.lesseeInfo.goodsTypeId = [];
      this.lesseeInfo.businessTypeId = [];
    },
    cancelCopyLessee() {
      this.copyShow = false;
      this.lesseeInfo = {
        lesseeId: '',
        businessId: '',
        departId: [],
        goodsTypeId: [],
        businessTypeId: [],
      };
      this.lesseeOptions = [];
      this.businessOptions = [];
      this.departOptions = [];
      this.businessTypeOptions = [];
      this.goodsTypeOptions = [];
    },
  },
};
</script>
<style lang="scss">
@import '@/assets/css/views/content.scss';
</style>
<style lang="scss" scoped>
.time {
  display: flex;
  align-items: center;
  margin-bottom: 10px;

  .label {
    font-size: 14px;
    margin-right: 10px;
  }
}

.img-wrapper {
  width: 80px;
  height: 60px;
  overflow: hidden;
  border-radius: 3px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;

  .el-image {
    width: 100%;

    &::v-deep img {
      width: 100%;
      height: auto;
    }
  }
}
</style>
